/**
 * @author BoLiang
 */
if (typeof accedo === "undefined") {
	accedo = {};
}
if (typeof accedo.achievement === "undefined") {
	accedo.achievement = {};
}

accedo.achievement.achiFriendsShow = {

		divFriMain: null,
		divFriInner: null,
		divFriCtn: null,
		divFriCtnInner: null,
		divFriLeftArrow: null, 
		divFriRightArrow: null,
		oldOnkeydownFunc: null,
		divCurrID: 0,
		divLength: 0,
		moveCount : 0,
		divFriCtnInnerLength : 0,
		maxLeft: 0,
		minLeft: 0,
		
		init : function() {
			this.divFriMain = null;
			this.divFriInner = null; 
			this.divFriCtn = null;
			this.divFriCtnInner = null;
			this.divFriRightArrow = null; 
			this.divFriRightArrow = null; 
			this.oldOnkeydownFunc = null;
			this.divCurrID = 0;
			this.divLength = 0;
			this.moveCount = 0;
			this.divFriCtnInnerLength = 0; 
			this.maxLeft = 0;
			this.minLeft = 0;
		},
		
		createFriDiv : function() {
			
			this.divFriCtnInner = document.createElement("div"); 
			this.divFriCtnInner.id = "divFriCtnInner"; 
			
			this.divFriCtn = document.createElement("div"); 
			this.divFriCtn.id = "divFriCtn";
			this.divFriCtn.appendChild(this.divFriCtnInner); 
			
			this.divFriLeftArrow = document.createElement("div"); 
			this.divFriLeftArrow.id = "divFriLeftArrow";
			this.divFriLeftArrow.innerHTML = "<img width=100% height=100% src='http://"
								+ accedo.achievement.config.serverIP + ":" 
								+ accedo.achievement.config.serverPort + "/" 
								+ accedo.achievement.config.pluginName + "/achiPlugin/achi-images/achiLeftArrow.png' />";

			this.divFriRightArrow = document.createElement("div"); 
			this.divFriRightArrow.id = "divFriRightArrow";
			this.divFriRightArrow.innerHTML = "<img width=100% height=100% src='http://"
								+ accedo.achievement.config.serverIP + ":" 
								+ accedo.achievement.config.serverPort + "/" 
								+ accedo.achievement.config.pluginName + "/achiPlugin/achi-images/achiRightArrow.png' />";
			
			
			this.divFriInner = document.createElement("div"); 
			this.divFriInner.id = "divFriInner"; 
			
			this.divFriInner.appendChild(this.divFriLeftArrow);
			this.divFriInner.appendChild(this.divFriCtn); 
			this.divFriInner.appendChild(this.divFriRightArrow);
			
			
			this.divFriMain = document.createElement("div"); 
			this.divFriMain.id = "divFriMain"; 
			this.divFriMain.appendChild(this.divFriInner); 
			
			var bodyNode = document.getElementsByTagName("body")[0]; 
			bodyNode.appendChild(this.divFriMain); 		
		},
		
		initFri : function(username) {
			dwr.engine.setPreHook(this.preHook); 
			dwr.engine.setPostHook(this.postHook); 
			UserService._path = "http://"
								+ accedo.achievement.config.serverIP + ":" 
								+ accedo.achievement.config.serverPort + "/" 
								+ accedo.achievement.config.pluginName + "/dwr";
			UserService.getJsonFriendsByUsername(username, this.initFriCallback);
		},
		preHook : function() {
			
		},
		postHook : function() {
			
		},
		
		initFriCallback : function(data) {
			var serverDataObj = eval("(" + data + ")");
			var leftInterval = 0;
			accedo.achievement.achiFriendsShow.divLength = serverDataObj.friends.length;
			accedo.achievement.achiFriendsShow.divFriCtnInner.style.width = (serverDataObj.friends.length * 250) + "px"; 
			
			accedo.achievement.achiFriendsShow.divFriCtnInnerLength = serverDataObj.friends.length * 250;
			accedo.achievement.achiFriendsShow.maxLeft = 0; 
			accedo.achievement.achiFriendsShow.minLeft = 1000 - accedo.achievement.achiFriendsShow.divFriCtnInnerLength;
			
			
			for(var friNum = 0; friNum < serverDataObj.friends.length; friNum++) {
				var divFriCell = document.createElement("div");
				leftInterval = leftInterval + 10;
				divFriCell.style.left = leftInterval + "px"; 
				divFriCell.id = "Fri" + friNum; 
				divFriCell.className = "divFriCell"; 
				var divFriAvatar = document.createElement("div"); 
				divFriAvatar.id = "divFriAvatar"; 
				divFriAvatar.innerHTML = "<img width=100% height=100% src='http://"
								+ accedo.achievement.config.serverIP + ":"
								+ accedo.achievement.config.serverPort + "/" 
								+ accedo.achievement.config.pluginName + "/images/userImages/user"
					+ serverDataObj.friends[friNum].friend_id
					+ ".png' />";
				var divFriName = document.createElement("div"); 
				divFriName.id = "divFriName"; 
				
				
				divFriName.innerHTML = "<font size=6px color=white>" 
					+ serverDataObj.friends[friNum].friend_name 
					+ "</font><input type='hidden' id=hiddenFri"
					+ friNum
					+ " value='"
					+ serverDataObj.friends[friNum].friend_name
					+ "' />"; 
				
				divFriCell.appendChild(divFriAvatar); 
				divFriCell.appendChild(divFriName); 
				accedo.achievement.achiFriendsShow.divFriCtnInner.appendChild(divFriCell); 
				
//				accedo.achievement.achiFriendsShow.divCurrID = 0;
				var divNode = document
						.getElementById("Fri" + accedo.achievement.achiFriendsShow.divCurrID);
				divNode.style.borderColor = "yellow";
				divNode.style.backgroundColor = "#FF5511";
				
				
				
				
			}
			accedo.achievement.achiFriendsShow.oldOnkeydownFunc = document.onkeydown;
			document.onkeydown = function(e) {
				accedo.achievement.achiFriendsShow.keysControl(e);
			};
		},
		
		appendFri : function(username) {
			this.init(); 
			this.createFriDiv(); 
			this.initFri(username);
			
			 
			
			
			this.divFriInner.className = "startFriInner"; 
		},
		
		moveCurrDiv : function(direction) {
			var divOldNode = document.getElementById("Fri" + this.divCurrID);
			if (direction == "right" && this.divCurrID < this.divLength - 1) {
				this.divCurrID = this.divCurrID + 1;
				var divNewNode = document.getElementById("Fri" + this.divCurrID);
				divOldNode.style.borderColor = "#666666";
				divOldNode.style.backgroundColor = null;

				divNewNode.style.borderColor = "white";
				divNewNode.style.backgroundColor = "#FF6600";

				if (this.moveCount == 3) {
					var topValue = this.divFriCtnInner.offsetLeft - 250;
					
					this.divFriCtnInner.style.left = topValue + "px";
					
					if (topValue <= this.minLeft) {
						this.divFriRightArrow.style.visibility = "hidden"; 
					}
					
					if (topValue < this.maxLeft) {
						this.divFriLeftArrow.style.visibility = "visible"; 
					}
					
					
				} else {
					this.moveCount++;
				}

			} else if (direction == "left" && this.divCurrID > 0) {
				this.divCurrID = this.divCurrID - 1;
				var divNewNode = document.getElementById("Fri" + this.divCurrID);
				divOldNode.style.borderColor = "#666666";
				divOldNode.style.backgroundColor = null;
				divNewNode.style.borderColor = "white";
				divNewNode.style.backgroundColor = "#FF6600";

				if (this.moveCount == 0) {
					var topValue = this.divFriCtnInner.offsetLeft + 250;
					this.divFriCtnInner.style.left = topValue + "px";
					
					if (topValue >= this.maxLeft) {
						this.divFriLeftArrow.style.visibility = "hidden"; 
					}
					
					if (topValue > this.minLeft) {
						this.divFriRightArrow.style.visibility = "visible"; 
					}

				} else {
					this.moveCount--;
				}
			}
		},
		
		keysControl : function(e) {
			e = window.event || e;
			switch (e.keyCode) {
			// esc button
			case 27:
				this.closePage();
				accedo.achievement.achiCompareShow.recoverUserAchis();
				break;
			// left button
			case 37:
				this.moveCurrDiv("left"); 
				break;
			// up button
			case 38:
				accedo.achievement.achiShow.moveCurrDiv("up");
				break;
			// right button
			case 39:
				this.moveCurrDiv("right");
				break;
			// down button
			case 40:
				accedo.achievement.achiShow.moveCurrDiv("down");
				break;
				
				// enter button
			case 13:
				
				
				var hiddenInputNode = document.getElementById("hiddenFri"
						+ this.divCurrID);
				var friendNameValue = hiddenInputNode.getAttribute("value");
				accedo.achievement.achiCompareShow.appendCompare(friendNameValue, accedo.achievement.achiShow.appSn);
				break;
			default:
				break;
			}
		},
		
		closePage : function() {
			this.divFriInner.className = "endFriInner";
			document.onkeydown = this.oldOnkeydownFunc;
			setTimeout(function(){ 
				var bodyNode = document.getElementsByTagName("body")[0];
				bodyNode.removeChild(accedo.achievement.achiFriendsShow.divFriMain); 
			},400);
			
		}
		

};
